<!--
 * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @Date: 2024-05-30 11:25:05
 * @LastEditors: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
 * @LastEditTime: 2024-05-31 09:45:21
 * @FilePath: \driving-training-admin\src\views\system\dict\list\Index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="page-box">
        <TemplateVue
            :page="data.pageData"
            @search="data.onSearch"
            @reset="data.onReset"
            @paginationChange="data.onPaginationChange"
            @paginationSize="data.onPaginationSize"
            @operation="data.onOperation"
        >
        </TemplateVue>

        <BasicDialogVue :data="data.dialog" @close="data.onCloseDialog(ruleFormRef)">
            <template #content>
                <div class="">
                    <el-form
                        ref="ruleFormRef"
                        :rules="data.dictRules"
                        :model="data.dictForm"
                        label-width="auto"
                        style="max-width: 600px"
                    >
                        <el-form-item label="名称：" prop="name">
                            <el-input v-model="data.dictForm.name" />
                        </el-form-item>
                        <el-form-item label="字典编码：" prop="key">
                            <el-input v-model="data.dictForm.key" />
                        </el-form-item>
                        <el-form-item label="字典类型" prop="type">
                            <el-select v-model="data.dictForm.type" placeholder="请选择" style="width: 100%">
                                <el-option label="后台管理" value="1" />
                                <el-option label="小程序" value="2" />
                            </el-select>
                        </el-form-item>
                        <el-form-item label="描述">
                            <el-input v-model="data.dictForm.desc" type="textarea" />
                        </el-form-item>
                        <el-form-item>
                            <div style="width: 100%; display: flex; justify-content: center">
                                <el-button type="primary" @click="data.submitForm(ruleFormRef)">确定</el-button>
                                <el-button @click="data.onCloseDialog(ruleFormRef)">取消</el-button>
                            </div>
                        </el-form-item>
                    </el-form>
                </div>
            </template>
        </BasicDialogVue>
    </div>
</template>
<script setup lang="ts">
import TemplateVue from '@/components/template/Index.vue'
import DicttData from '.'
import { reactive, ref } from 'vue'
import BasicDialogVue from '@/components/baseDialog/Index.vue'
import { FormInstance } from 'element-plus/es/components'
const data = reactive(new DicttData())
const ruleFormRef = ref<FormInstance>()
const radio1 = ref('1')
</script>

<style scoped lang="scss">
.time {
    display: flex;
}
.btn {
    display: flex;
    justify-content: center;
    margin: 40px 0 16px 0;
}
</style>
